<div class="login-body">
    <div class="language-box" #languagebox (focus)="onShow()" (blur)="onHide()" tabindex="1">
		<a>
			<img *ngIf="lang.lang === 'zh'" src="../../../assets/icons/Country/china.png" />
			<img *ngIf="lang.lang === 'en'" src="../../../assets/icons/Country/en.png" />
			<img *ngIf="lang.lang === 'jp'" src="../../../assets/icons/Country/jp.png" />
		</a>
		<div class="language-select" [hidden]="!langShow">
			<div (click)="changeLang('zh')"><img src="../../../assets/icons/Country/china.png" /></div>
			<div (click)="changeLang('en')"><img src="../../../assets/icons/Country/en.png" /></div>
			<div (click)="changeLang('jp')"><img src="../../../assets/icons/Country/jp.png" /></div>
		</div>
	</div>
    <h3 class="back" routerLink="/">{{'loginPage.next' | translate}}></h3>
    <div class="login-tab lf">
        <span class="activitie">
                {{'login' | translate}}
        </span>
        <span class="no-activitie" routerLink="/register">{{'register' | translate}}</span>
    </div>

    <div class="login-form-databody white-input">
        <form #f="ngForm" (ngSubmit)="onSave(f)">

            <div class="weui-cell weui-cell_vcode">
                <div class="weui-cell__bd">
                    <input class="weui-input" type="text" autocomplete="off"
                        placeholder="{{'loginPage.input-userId' | translate}}"
                        [(ngModel)]="res.id" name="id" [minlength]='4' [maxlength]="32"  />
                </div>
                <div class="weui-cell__ft" *ngIf='!f.controls.id?.valid && f.controls.id?.dirty'><i style="width: 2rem;margin-left: 1rem;" class="weui-icon-warn"></i></div>
            </div>

            <div class="weui-cell weui-cell_vcode">
                <div class="weui-cell__bd">
                    <input class="weui-input" type="password" autocomplete="new-password" required
                        placeholder="{{'loginPage.input-password' | translate}}"
                        [(ngModel)]="res.loginPw" name="loginPw" />
                </div>
                <div class="weui-cell__ft" *ngIf='!f.controls.loginPw?.valid && f.controls.loginPw?.dirty'>
                    <i style="width: 2rem;margin-left: 1rem;" class="weui-icon-warn"></i></div>
                <div class="weui-cell__ft" style="color: red; font-size: 1.5rem;" *ngIf='pwError' >
                    {{'loginPage.html1' | translate}} 
                    {{jhNum}}
                    {{'loginPage.html2' | translate}} 
                </div>
            </div>

            <div class="rf login-wjmm" ><a href="javascript:;" routerLink="/updatePwd/3">{{'loginPage.forget-password' | translate}}</a></div>
            <div class="login-subbtn">
                <button  weui-button disabled='{{!f.valid}}' >{{'login' | translate}}</button>
            </div>
        </form>
    </div>
</div>